<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org"
				xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
	<meta charset="utf-8"/>
	<title>个人中心</title>
	<meta name="renderer" content="webkit"/>
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
	<meta name="apple-mobile-web-app-status-bar-style" content="black"/>
	<meta name="apple-mobile-web-app-capable" content="yes"/>
	<meta name="format-detection" content="telephone=no"/>
	<link rel="stylesheet" href="../css/layui.css" media="all"/>
	<link rel="stylesheet" href="../css/user.css" media="all" />
	<link href="../css/bootstrap.css" rel="stylesheet"/>
    <link href="../css/all.css" rel="stylesheet"/>
    <link href="../css/index.css" rel="stylesheet"/>
    <script src="../js/jquery-2.0.3.min.js"></script>
    <script src="../layui.js"></script>
    <style type="text/css">
    .layui-form-label{
    	width: 100px;
    }
    .myInfo{
    	width: 1150px;
    	margin: 0 auto;
    }
    </style>
    <script type="text/javascript">
    function save(){
    	var nickname = $("#nickname").val();
    	var birthday = $("#birthday").val();
    	if(nickname==null||nickname==""){
    		alert("请填写昵称！");
    		return ;
    	}
    	var timereg=/^\d{4}-(?:0\d|1[0-2])-(?:[0-2]\d|3[01])( (?:[01]\d|2[0-3])\:[0-5]\d\:[0-5]\d)?$/;  
    	if(timereg.test(birthday)== false){
    		alert("时间格式应为1990-01-01！");
    		return ;
    	}
		$.ajax({
			url:"../my/updateUserInfo",
			type:"POST",
			data:{nickname:nickname,birthday:$("#birthday").val(),sign:$("#sign").val()},
			success:function(data){
				alert(data.rspMsg);
			},
			error:function(data){
				alert("请输入正确的数据");
			}
		});
	}
    
    function auth(){
    	var realname = $("#realname").val();
    	var idcard = $("#idcard").val();
    	var sex = $('input:radio[name="sex"]:checked').val();
    	var address = $("#address").val();
    	var phone = $("#phone").val();
    	if(realname==null||realname==""){
    		alert("请填写真实姓名！");
    		return ;
    	}
    	if(idcard==null||idcard==""){
    		alert("请填写身份证号！");
    		return ;
    	}
    	var reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;    
    	if(reg.test(idcard)== false){
    		alert("身份证号格式不正确！");
    		return ;
    	}
    	if(address==null||address==""){
    		alert("请填写联系地址！");
    		return ;
    	}
    	if(phone==null||phone==""){
    		alert("请填写手机号！");
    		return ;
    	}
    	var myreg=/^[1][3,4,5,7,8][0-9]{9}$/;  
        if (!myreg.test(phone)) {
        	alert("手机号格式不正确！");
    		return ;
        }
		$.ajax({
			url:"../my/updateUserInfo",
			type:"POST",
			data:{realname:realname,idcard:idcard,sex:sex,
				address:address,phone:phone},
			success:function(data){
				if(data.rspCode=="000000"){
					alert("提交实名信息成功,请耐心等待管理员审核");
				}else{
					alert(data.rspMsg);
				}
				
			}
		});
	}
    </script>
</head>
<body>

	<div th:include="include :: header"></div>
	
	<div class="layui-form myInfo" style="min-height:723px;">
		<div class="user_left">
			<br/><br/>
			<div class="layui-form-item">
			    <label class="layui-form-label">用户昵称</label>
			    <div class="layui-input-block">
			    	<input type="text"  class="layui-input" id="nickname" th:value="${user.nickname}"/>
			    </div>
			</div>
			<div class="layui-form-item">
			    <label class="layui-form-label">生日</label>
			    <div class="layui-input-block">
			    	<input type="text" value="" id="birthday" placeholder="请输入出生年月" lay-verify="required|date" onclick="layui.laydate({elem: this,max: laydate.now()})" class="layui-input"  th:value="${user.birthday==null}? '':${#dates.format(user.birthday,'yyyy-MM-dd')}"/>
			    </div>
			</div>
			<div class="layui-form-item">
			    <label class="layui-form-label">个性签名</label>
			    <div class="layui-input-block">
			    	<textarea  class="layui-textarea" th:text="${user.sign}" id="sign"></textarea>
			    </div>
			</div>
			<div class="layui-form-item" style="text-align: center;">
			    <button class="layui-btn" onclick="save()">保存更改</button>
			</div>
			<hr/><hr/><h3 align="center" style="color: red;" th:text="${user.authProcess}==0? '未实名认证':'已实名认证'">未实名认证</h3><hr/><hr/>
			<div th:switch="${user.authProcess}">
				<div class="layui-form-item" th:case="1">
				    <label class="layui-form-label">会员级别</label>
				    <div class="layui-input-block">
				    <span class="layui-badge layui-bg-green" >认证会员</span>
				    </div>
				</div>
				<div class="layui-form-item" th:case="2">
				    <label class="layui-form-label">会员级别</label>
				    <div class="layui-input-block">
				    	<span class="layui-badge layui-bg-blue">押金会员</span>
				    </div>
				    <label class="layui-form-label">押金数：</label>
				    <div class="layui-input-block">
				    	<input type="text"  class="layui-input"  th:value="${user.deposit}+'元'" disabled="disabled"/>
				    </div>
				</div>
				<div class="layui-form-item" th:case="3">
				    <label class="layui-form-label">会员级别</label>
				    <div class="layui-input-block" style="margin: 0 0">
				    	<span class="layui-badge">爱心会员</span>
  						<span class="layui-badge" th:text="'A'+${user.level}" style="border-radius: 9px;padding-right: 13px;padding-left: 13px;"></span>
				    </div>
				</div>
				
				<div th:case="0">
					<div class="layui-form-item">
				    <label class="layui-form-label">真实姓名</label>
				    <div class="layui-input-block">
				    	<input type="text" id="realname" placeholder="请输入真实姓名" lay-verify="required" class="layui-input" th:value="${user.realname}"/>
				    </div>
					</div>
					<div class="layui-form-item">
					    <label class="layui-form-label">性别</label>
					    <div class="layui-input-block" >
					    	男：<input type="radio" name="sex" value="1" title="男" th:checked="${user.sex}=='1'" style="display: inline-block;"/>
			     			&nbsp;&nbsp;女：<input type="radio" name="sex" value="0" title="女" th:checked="${user.sex}=='0'" style="display: inline-block;"/>
					    </div>
					</div>
					<div class="layui-form-item">
					    <label class="layui-form-label">身份证号</label>
					    <div class="layui-input-block">
					    	<input type="text" id="idcard" placeholder="请输入身份证号码" lay-verify="required" class="layui-input" th:value="${user.idcard}"/>
					    </div>
					</div>
					<div class="layui-form-item">
					    <label class="layui-form-label">联系地址</label>
					    <div class="layui-input-block">
					    	<input type="text" id="address" placeholder="请输入地址" lay-verify="required" class="layui-input" th:value="${user.address}"/>
					    </div>
					</div>
					<div class="layui-form-item">
					    <label class="layui-form-label">手机号码</label>
					    <div class="layui-input-block">
					    	<input type="tel" id="phone" placeholder="请输入手机号码" lay-verify="required|phone" class="layui-input" th:value="${user.phone}"/>
					    </div>
					</div>
					<div class="layui-form-item" style="text-align: center;">
					    <button class="layui-btn" onclick="auth()">提交实名信息</button>
					</div>
				</div>
			</div>
		</div>
		<div class="user_right">
			<br/><br/>
			<div class="layui-upload">
			  <button type="button" class="layui-btn" id="uploadImg">更换头像</button>
			  <div class="layui-upload-list">
			    <img class="layui-upload-img layui-circle" id="userImg" th:src="${user.headImg}"/>
			    <p id="imgText"></p>
			  </div>
			</div>
		</div>
		<div class="layui-form-item" style="text-align: center;">
		    <div class="layui-input-block">
		    </div>
		</div>
	</div>
	
	<div th:include="include :: footer"></div>

	
<script>
<!-- 图片上传 -->
layui.use('upload', function(){
	  var $ = layui.jquery
	  ,upload = layui.upload;
	  
	  //头像更新上传
	  var uploadInst = upload.render({
	    elem: '#uploadImg'
	    ,url: '../my/uploadImg'
    	,data: {
   		  
   		}
	    ,exts: 'png|jpg|bmp|jpeg|gif'
	  	,size: 10240
	    ,before: function(obj){
	      //预读本地文件示例，不支持ie8
	      obj.preview(function(index, file, result){
	        $('#userImg').attr('src', result); //图片链接（base64）
	      });
	    }
	    ,done: function(res){
	      //上传成功
	      if(res.rspCode =="000000"){
	          return layer.msg('更换图片成功');
	      }else{
	    	  return layer.msg('更换图片失败');
	      }
	    }
	    ,error: function(){
	      //重传
	      var imgText = $('#imgText');
	      imgText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
	      imgText.find('.demo-reload').on('click', function(){
	        uploadInst.upload();
	      });
	    }
	  });
	});
</script>
	
</body>
</html>